<!doctype html>
<html class="no-js" lang="">

<head>
  <meta charset="utf-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <title></title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

  <link rel="manifest" href="site.webmanifest">
  <link rel="apple-touch-icon" href="icon.png">
  <!-- Place favicon.ico in the root directory -->

  <link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/main.css">

  <!-- custom css -->
  <link rel="stylesheet" href="css/index.css">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/animate.css@3.5.2/animate.min.css"
        integrity="sha384-OHBBOqpYHNsIqQy8hL1U+8OXf9hH6QRxi0+EODezv82DfnZoV7qoHAZDwMwEJvSw" crossorigin="anonymous">

</head>

<body>
<!--[if lte IE 9]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade
  your browser</a> to improve your experience and security.</p>
<![endif]-->

<!-- Add your site or application content here -->
<!--<p>Hello world! This is HTML5 Boilerplate.</p>-->
<div class="nav-wrapper">
  <div class="left">
    <a href="https://gitee.com/XiaoLanMiao" target="_blank">
      <!--<img src="img/logo-gitee.png" alt="">-->
      <img src="https://hilanmiao-1255950273.cos.ap-chengdu.myqcloud.com/logo-gitee.png" alt="">
    </a>
    <a href="https://github.com/hilanmiao" target="_blank">
      <!--<img src="img/logo-github.png" alt="">-->
      <img src="https://hilanmiao-1255950273.cos.ap-chengdu.myqcloud.com/logo-github.png" alt="">
    </a>
  </div>

  <div class="right">
    <a href="#" class="animated active">
      <span class="tag">○</span>
      HOME
    </a>
    <a href="#" class="animated">
      <span class="tag">○</span>
      ABOUT
    </a>
    <a href="#" class="animated">
      <span class="tag">○</span>
      CONTACT
    </a>
    <a href="#" class="animated">
      <span class="tag">○</span>
      PROJECT
    </a>
  </div>
</div>

<div class="starry-wrapper">
  <canvas id="starry"></canvas>
</div>

<!-- Default view dimension 400 x 100 -->
<div class="digital-clock-wrapper">
  <div class="title">CURRENT TIME</div>
  <canvas id="digital-clock" width="200" height="50"></canvas>
</div>

<div class="content-wrapper">
  <div class="glitch-text-wrapper" id="glitch-text-wrapper">
    <!--<img src="img/glitch-text.png" alt="" class="signature1">-->
    <!--<img src="img/japanese.png" alt="" class="signature2">-->
    <img src="https://hilanmiao-1255950273.cos.ap-chengdu.myqcloud.com/glitch-text.png" alt="" class="signature1">
    <img src="https://hilanmiao-1255950273.cos.ap-chengdu.myqcloud.com/japanese.png" alt="" class="signature2">
  </div>

  <div class="gandum-wrapper" id="gandum-wrapper">
    <!--<img src="img/gandum.png" alt="" class="gandum">-->
    <!--<img src="img/lightning/4.png" alt="" class="gandum-lightning1">-->
    <!--<img src="img/lightning/5.png" alt="" class="gandum-lightning2">-->
    <!--<img src="img/lightning/6.png" alt="" class="gandum-lightning3">-->
    <img src="https://hilanmiao-1255950273.cos.ap-chengdu.myqcloud.com/gandum.png" alt="" class="gandum">
    <img src="https://hilanmiao-1255950273.cos.ap-chengdu.myqcloud.com/4.png" alt="" class="gandum-lightning1">
    <img src="https://hilanmiao-1255950273.cos.ap-chengdu.myqcloud.com/5.png" alt="" class="gandum-lightning2">
    <img src="https://hilanmiao-1255950273.cos.ap-chengdu.myqcloud.com/6.png" alt="" class="gandum-lightning3">
  </div>
</div>

<div class="lightning-wrapper">
  <!--<img src="img/lightning/1.png" alt="" class="lightning1">-->
  <!--<img src="img/lightning/2.png" alt="" class="lightning2">-->
  <!--<img src="img/lightning/3.png" alt="" class="lightning3">-->
  <img src="https://hilanmiao-1255950273.cos.ap-chengdu.myqcloud.com/1.png" alt="" class="lightning1">
  <img src="https://hilanmiao-1255950273.cos.ap-chengdu.myqcloud.com/2.png" alt="" class="lightning2">
  <img src="https://hilanmiao-1255950273.cos.ap-chengdu.myqcloud.com/3.png" alt="" class="lightning3">
</div>

<!-- 这个放在上面glitch效果会盖住其他内容 -->
<div class="glitch-bg">
  <!--<img src="img/glitch-bg.png" alt="">-->
  <img src="https://hilanmiao-1255950273.cos.ap-chengdu.myqcloud.com/glitch-bg.png" alt="">
</div>

<script src="js/vendor/modernizr-3.6.0.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"
        integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-3.3.1.min.js"><\/script>')</script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>

<!-- custom script -->
<script src="https://cdn.jsdelivr.net/npm/zeu"
        integrity="sha384-ENXInxMvysSb76mtiULu9Q4embZuAHSyxjEHG/Oy6m44l2FRsKNIICtrb2N+oDw7"
        crossorigin="anonymous"></script>
<script>window.zeu || document.write('<script src="js/vendor/zeu/zeu.min.js"><\/script>')</script>
<script src="js/vendor/mg-glitch/mgGlitch.min.js"></script>
<script src="js/starry.js"></script>
<script src="js/zeu-control.js"></script>
<script src="js/animate.js"></script>


<!-- Google Analytics: change UA-XXXXX-Y to be your site's ID. -->
<script>
  window.ga = function () {
    ga.q.push(arguments)
  };
  ga.q = [];
  ga.l = +new Date;
  ga('create', 'UA-XXXXX-Y', 'auto');
  ga('send', 'pageview')
</script>
<script src="https://www.google-analytics.com/analytics.js" async defer></script>
</body>

</html>
